<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>产品展示</title>
		<style>

			*{
			 margin: 0;
			 padding: 0;
			}
			
			
			
			 .a{ 
				 position: relative;
			     width: 200px;
				 height:50px;
				 top: 7px;
				 background-image: url(产品-Bellucci%20EVOO_files/logo_k.png);
				 }
		
				
				
			li{
				list-style-type:none;
				float: left;
				width: 100px;
				margin-left: 30px;
			}

			ul{
					position: relative;
					top: -25px;
					left: 73%;
					width: 300PX;
					overflow: auto;
			} 
			a{
				text-decoration: none;	
				font-size: small;
				font-family: "微软雅黑";
				color: #444444;
				
			 }
			 a:hover{
				     background-color: #AFD9EE;
					 color: #89bf55;
			        }
			 
			 .b{
				 width:1200;
				 height:125px;
				 margin-top: 5px;
				 background-color: #f9f9f9;
				 text-align: center;
				 font-family: "宋体";
				 font-weight: 50;
				 font-size: 80px;
			 }
			 
			 .b2{
				position: relative;
				left: 13%;
				 width: 1100px;
			 }
			 .b3{
				position: relative;
				 left:13%;
				 width: 1100px;
				 height: 340px;
				 top: 80px;
			 }
		    .b4{
				position: relative;
				left:7%;
			}
			.b5{
				position: relative;
				left:23%;
			}
			.b6{
				position: relative;
				left:40%;
			}
			.c1{
				position: relative;
				left:9%;
			}
			.c2{
				position: relative;
				left:29%;
			}
			.c3{
				position: relative;
				left:51%;
			}
			 p{
				width: 1px;height: 1px;
				background-color: #000000;
				display: none;
				
				}
		  
		  img{
			 transition: all .3s; 
			 margin-top: 8px;
		  }
		  img:hover{
			  transform: scale(1.04);
		  }
		  .xx1:hover{
			  background-color: #000000;
		      color: #FFFFFF;
		  }
		  .xx2:hover{
			  background-color: #000000;
			  color: #FFFFFF;
			  }
			  #toggle {
			  	width: 50px;
			  	height: 50px;
			  	border-radius: 500px 500px;
			  	display: inline-block;
			  	margin-left: 1px;
			  	margin-top: 6px;
			  	background-color: lightslategrey;
			  	opacity: 0;
			  }
			  
			  #toggle~span {
			  	width: 25px;
			  	height: 4px;
			  	background-color: darkgray;
			  	display: block;
			  	margin: 9px 12px;
			  	position: absolute;
			  
			  }
			  
			  .span {
			  	top: 10px;
			  	left: 1px;
			  }
			  
			  .span2 {
			  	top: 20px;
			  	left: 1px;
			  }
			  
			  .span3 {
			  	top: 30px;
			  	left: 1px;
			  }
			1ul:hover{
				background-color: #AFD9EE;
				color: #31708F;
			}
			
		  	
		</style>
	</head>
	<body>
		<div>
			<div>
				<div class="a"><a href="联系我们.html">
				<a href="#" id="toggle"></a>
				<span class="span sspan"></span>
				<span class="span2 sspan"></span>
				<span class="span3 sspan"></span>
				</div>
				<ul>
					<li style="width: 52px;"><a href="产品展示.html">产品展示</a>
						<!-- <p></p> -->
					</li>
					<li style="width: 66px;"><a href="#">商店定位器</a>
						<!-- <p></p> -->
					</li>
					<li style="width:66px;"><a href="联系我们.html">联系</a>
						<!-- <p></p> -->
					</li>
				</ul>
			</div>
			<div class="b">
				<font style="vertical-align: inherit;">用意大利风味烹饪</font>
			</div>
			<div class="b2">
				<img src="产品-Bellucci%20EVOO_files/roaested_fingerling_mini.jpg" >
				<img src="产品-Bellucci%20EVOO_files/roasted-red-pepper-crostini-with-whipped-ricotta-mini.jpg" style="margin-left: 30px;">
				<img src="./产品-Bellucci%20EVOO_files/lemon-blueberry-cornmeal-cake-mini.jpg" style="margin-left: 30px;">

				<div>
					<span>
						<a href="#" class="b4">
							烟熏辣椒粉烤烤鱼种土豆
						</a>
					</span>
					<span>
						<a href="#" class="b5">烤的红辣椒猪排配意大利乳清干酪</a>
					</span>
					<span>
						<a href="#" class="b6">柠檬蓝莓玉米面蛋糕</a>
					</span>
				</div>
			</div>
			<div class="b3">
				<img src="产品-Bellucci%20EVOO_files/swordfish-with-anchovy-caper-sauce-mini.jpg" style="width: 320px;height: 280px;">
				<img src="产品-Bellucci%20EVOO_files/evoo-poached-halibut-mini.jpg" style="width: 310px;height: 280px;margin-left: 30px;">
				<img src="./产品-Bellucci%20EVOO_files/jacks-stuffed-mushrooms-mini.jpg" style="width: 320px;height: 280px;margin-left: 30px;">

				<div>
					<a href="#" class="c1">word鱼刺山柑汁箭鱼</a>
					<a href="#" class="c2">EVOO水煮大比目鱼</a>
					<a href="#" class="c3">地中海奥佐沙拉</a>
				</div>
				</div>
				<div style="width: 328px;height: 28px;background-color: #;margin-left: 560px;margin-top: 60px;text-align: center;line-height: 28px;">
					<span>

						<font style="width:30px;color: #EAE9E9;margin: 10px 10px;font-size: 12px;float: left;height: 28px;background-color: #000000;">1</font>
						<font class="xx1" style="height: 28px;width:30px;margin: 10px 10px;font-size: 12px; float: left;">2</font>
						<font class="xx2" style="height: 28px;width:30px;margin: 10px 10px;font-size: 12px;float: left;">3</font>
                        <font class="xx2" style="height: 28px;width:30px;margin: 10px 10px;font-size: 12px;float: left;">4</font>
                        <font class="xx2" style="height: 28px;width:30px;margin: 10px 10px;font-size: 12px;float: left;">5</font>
					</span>
				</div>
				<hr style="width: 1200px;margin-top: 60px;margin-left: 75px;">
					<ul class="1ul" style="width: 260px;height: 300px;margin-top: 100px;margin-left: -900px;font-size: small;">
						
						<li style="width: 180px;height: 40px;">
							<a href="产品展示.html">产品展示</a>
						</li>	
						<li style="width: 180px;height: 40px;">
							100％意大利EVOO
						</li>
					    <li style="width: 180px;height: 40px;">
							有机EVOO
						</li>
						<li style="width: 220px;height: 40px;">
							SACHET 100％意大利EVOO
						</li>
						<li style="width: 180px;height: 40px;">
							SACHET有机EVOO
						</li>
						<li style="width: 180px;height: 40px;">
							SICILIA PGI有机EVOOO
						</li>
						<li style="width: 180px;height: 40px;">
							托斯卡纳PGI EVOO
						</li>
					</ul>
					<ul style="width:230px;height:200px;margin-top: -300px;margin-left: -590px;">
						<li style="width:200px;height: 40px;">
							意大利是我的家
						</li>
						<li style="width: 200px;height: 40px;">
							贝鲁奇应用程序
						</li>
						<li style="width: 200px;height: 40px;">
							倒更多
						</li>
						<li style="width: 200px;height: 40px;">
							完全可追溯
						</li>
						<li style="width: 200px;height: 40px;">
							到达食谱
						</li>
				    </ul>
					<ul style="width: 170px;height: 140px;margin-top: -200px;margin-left: -344px;">
					  <li style="height: 40px;">
						 <a href="联系我们.html">联系</a>
					  </li>
					  <li style="height: 40px;">
					  	 <a href="#">商店定位器</a>				  
					  </li>
					  <li style="height: 40px;">
					  	 <a href="获奖.html">获奖情况</a>					  
					  </li>
					</ul>
				<hr style="margin-top:120px;width: 1200px;margin-left: 78px;">
				<script src="new_file.js" type="text/javascript" charset="utf-8"></script>
				<script type="text/javascript">
				</script>
	</body>
</html>
